<template>
  <view class="u-tag inline-block pl-20 pr-20 pt-20 pb-20 cfs-030000 fs-28 fw-500 mr-18 mb-18" :style="[getStyle()]">{{ text }}</view>
</template>

<script>
import {randomInt} from '@/utils/share'
export default {
  props: {
    text: {
      type: String,

    }
  },
  data() {
    return {
      cbgList: Object.freeze(['#f6ebe8', '#ebf6f5', '#f2f6e9']),
      cboList: Object.freeze(['#daaeaf', '#abd0d3', '#c0caa5'])

    };
  },
  methods:{
    getStyle(){
      const i=randomInt(this.cbgList.length)
      return {
        backgroundColor:this.cbgList[i],
        border:`1px solid ${this.cboList[i]}`
      }
    }
  }
}
</script>

<style lang="scss">

</style>
